<template lang="html">
<div id="tmp1">
  <ul class="mui-table-view">
    <li  v-for="item in list" class="mui-table-view-cell mui-media">
      <a href="javascript:;">
        <img class="mui-media-object mui-pull-left" :src="item.img_url">
        <div class="mui-media-body">
          {{item.title}}
          <p class='mui-ellipsis' v-text="item.zhaiyao"></p>
          <div class="ft">
            <span>发表时间：{{item.add_time|datafmt('YYYY-MM-DD')}}</span>
            <span class="click">点击数：{{item.click}}</span>
          </div>
        </div>
      </a>
    </li>


  </ul>
</div>
</template>

<script>
export default {
  data(){
    return{
      list:[]
    }
  },

  created(){
    this.getnewslist();
  },
  methods:{
     getnewslist(){
      var url = 'http://localhost:5009/b.json';
      this.$http.get(url).then(function(res){
        var data = res.body;

        if(data.status !=0){
          Toast(res.message);
          return;
        }
        this.list = data.message;
      })

    }
  }
}
</script>

<style scoped>
.mui-table-view .mui-media-object {
      max-width: 80px;
      height: 80px;
}
.ft{
  margin-top: 1.5em;
  font-size: 12px;
  color: #0094ff;
}
.ft .click{
  margin-left: 20px;
}
</style>
